<%@ page import="cn.cdut.servlet.tools.JDBC.Sign" %>
<%@ page import="cn.cdut.servlet.tools.Email.E_mail" %>
<%@ page import="cn.cdut.servlet.regsetr" %><%--
  Created by IntelliJ IDEA.
  User: 王勇
  Date: 2023/4/11
  Time: 17:49
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Title</title>
    <link href="Register.css" rel="stylesheet">
    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script>
        function sendsms(e){
            /*发送验证码功能*/
            countdown(e);                                   //若发送验证码成功，则调用倒计时函数
        }
        //倒计时函数
        var time = 60;
        function countdown(e){
            if (time == 0) {
                //e.setAttribute('disabled',false);         对没有disbaled属性的span标签，此方法无效
                e.setAttribute("onclick","sendsms(this)");
                $("#validate_span").html("Send");
                time = 10;
            }else{
                //e.attr('disabled',true);                  对没有disbaled属性的span标签，此方法也无效
                //e.setAttribute("onclick", '');            这样写也可以
                e.removeAttribute("onclick");
                $("#validate_span").html("Resend(" + time + ")");
                time--;
                setTimeout(function() {
                    countdown(e)
                },1000)
            }
        }
        function ff() {
            var demo = document.getElementsByClassName("text1");
            const xhttp = new XMLHttpRequest();
            // 发送请求
            xhttp.open("GET", "http://localhost:8077/E_mail_servlet?email="+demo[0].value);
            xhttp.send();
            xhttp.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {
                    // this.responseText;
                }
            };
        }
        function fun(){
            var em = document.getElementsByClassName("text1");

            var ps = document.getElementsByClassName("text2");

            var rps = document.getElementsByClassName("text3");

            window.location.href="/demo1?email="+em+"&psd="+ps+"&repsd="+reps;
        }
        function checkInput(event) {
            const input = event.target;
            input.value = input.value.replace(/[\u4e00-\u9fa5]/g, "");
        }
    </script>
</head>
<body>
<%
    if (Sign.zflag != 0) {
        switch (Sign.zflag) {
            case 1:
                out.print("<script>alert('" + "改用户已存在请重新注册" + "');</script>");
                request.setAttribute("repsd","");
                request.setAttribute("psd","");
                break;
            case 2:
                out.print("<script>alert('" + "请发送验证码" + "');</script>");break;
            case 3:
                out.print("<script>alert('" + "俩次密码不一样请重新输入" + "');</script>");
                request.setAttribute("repsd","");
                request.setAttribute("psd","");
                break;
            case 0:break;
            default: out.print("<script>alert('" + "验证码错误" + "');</script>");break;
        }
    }
    System.out.println(Sign.zflag);
    Sign.zflag = 0;
%>


<div class="header">
    <ul class="u-1">
        <li><div class="loname">小王外卖</div></li>
        <li> <div class="logo"></div></li>
        <li><a href="#">Home</a></li>
        <li><a href="#">Contact us</a></li>
        <li><a href="#">Help</a></li>
    </ul>
    <ul class="u-2">
        <li><a href="login.jsp">Login</a></li>
        <li><a href="register.jsp">Register</a></li>
    </ul>
</div>
<div class="box1-f">
    <div class="box1">
        <form action="/demo1" method="post" >
            <div style="margin: 0px auto;text-align:center;">
                <h4 style=" font-size: 50px; ">Register</h4>
                <div style="position: relative;">
                    <div style=" font-size: 15px;margin-left: -207px;">E-mail</div>
                    <div class="emailimg"></div><input class="text1" type="text" name="email" placeholder="Please enter your email"
                                                       required oninput="checkInput(event)" />
                </div>
                <div>
                    <div style=" font-size: 15px; margin-top: 10px;margin-left: -184px;">Password</div>
                    <div class="psdimg"></div><input type="password" name="psd" class="text2"
                                                     placeholder="Please enter a password" required  oninput="checkInput(event)"/>
                </div>
                <div style=" font-size: 15px; margin-top: 10px;margin-left: -184px;">Password</div>
                <div class="repsdimg"></div><input type="password" name="repsd" class="text3"
                                                   placeholder="Please enter your password again" required  oninput="checkInput(event)"/>
                <div>
                    <div class="code-f" style=" margin-left: -2px; width: 400px;">
                        <div style="     font-size: 15px;
    margin-top: 10px;
    margin-left: 73px;
    width: 170px;">Email verification code</div>
                        <div class="codeimg"></div><input type="text" name="code" class="code"
                                                          placeholder="Please enter the verification code" oninput="checkInput(event)"/>
                            <span id="validate_span"  name="code-sub" class="code-sub" value="Send" onclick="ff();sendsms(this);">Send</span>

                    </div>
                    <br>
                    <div>
                        <input type="submit" name="submit" id="sub" value="up" onclick="fun()">
                    </div>
                </div>
                <div style=" font-size: 15px;margin-top: 10px; margin-left: -223px;">Other register</div>
                <ul class="u-3" style="margin: 0 auto; display: flex;justify-content: space-around;width: 200px;">
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </div>
        </form>
    </div>
</div>
</html>
